<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>03首页01批发专场02详情</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="screen-orientation" content="portrait">
<meta name="x5-orientation" content="portrait">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
<meta http-equiv="Expires" content="-1">
<meta http-equiv="Cache-Control" content="no-cache">
<meta http-equiv="Pragma" content="no-cache">
<link href="css/public.css" rel="stylesheet" type="text/css" media="all" />
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<script src="js/jquery-2.1.4.min.js"></script>
</head>
<body>
    <header class="loginHeader_x indexbordercolor">
        <a href="" class="arr_a"></a>
    	<div class="navHeader">
        	<a href="">商品</a>
        	<a href="" class="lineCurrent fontcolor">详情</a>
        	<a href="">记录</a>
        </div>
        <div class="dot_more"></div>
    </header>
    <div class="more_selDiv">
    	<div class="more_seljiao"></div>
    	<div class="more_sela">
            <a href="" class="seach_a">搜索</a>
            <a href="" class="home_a">首页</a>
        </div>
    </div>    
        <!--商品介绍-->
    <div class="nav_int" style="border-top:none;margin-top:0">
    	<ul>
    		<li class="indexbordercolor fontcolor"><span>图文详情</span></li>
    		<li><span>商品参数</span></li>
    		<li>包装售后</li>
    	</ul>
    </div>
    <div class="content_int">
    	<ol>
    		<li  style="display:block;"><div class="content_inttxt">今年大热的“睡衣风”，穿出无拘无束的自由风，性感的V领超显女人味，宽松的版型+舒适的材质，在闷热的夏季最适合了哦，绝对不可错过的一款连衣裙。</div><img src="images/xx_img.jpg" class="sp_img"><img src="images/xx_img.jpg" class="sp_img"></li>
            <li>
            	<table width="96%" border="0" align="center" cellpadding="0" cellspacing="0" class="canshu_tablenew">
            		<tbody>
            		<tr>
            			<td width="30%" height="40" align="left" valign="middle" style="padding-left:3%">尺码</td>
            			<td width="20%" height="40" align="left" valign="middle">S</td>
                        <td height="40" align="left" valign="middle">M</td>
            		</tr>
                    <tr>
            			<td width="30%" height="40" align="left" valign="middle" style="padding-left:3%">后衣长</td>
            			<td width="20%" height="40" align="left" valign="middle">77</td>
                        <td height="40" align="left" valign="middle" >75</td>
            		</tr>
                    <tr>
            			<td width="30%" height="40" align="left" valign="middle" style="padding-left:3%">肩宽</td>
            			<td width="20%" height="40" align="left" valign="middle">77</td>
                        <td height="40" align="left" valign="middle" >75</td>
            		</tr>
                    <tr>
            			<td width="30%" height="40" align="left" valign="middle" style="padding-left:3%">胸围</td>
            			<td width="20%" height="40" align="left" valign="middle">77</td>
                        <td height="40" align="left" valign="middle" >75</td>
            		</tr>
                    <tr>
            			<td width="30%" height="40" align="left" valign="middle" style="padding-left:3%">袖子</td>
            			<td width="20%" height="40" align="left" valign="middle">77</td>
                        <td height="40" align="left" valign="middle">75</td>
            		</tr>
                     <tr>
            			<td width="30%" height="40" align="left" valign="middle" style="padding-left:3%">袖子</td>
            			<td width="20%" height="40" align="left" valign="middle">77</td>
                        <td height="40" align="left" valign="middle" >75</td>
            		</tr>
            		</tbody>
                </table>
                <div class="jianju14"></div>
                <table width="96%" border="0" align="center" cellpadding="0" cellspacing="0" class="canshu_tablenew">
            		<tbody>
            		<tr>
            			<td width="30%" height="40" align="left" valign="middle" style="padding-left:3%">腰型</td>
            			<td height="40" align="left" valign="middle">宽松腰</td>
            		</tr>
                    <tr>
            			<td width="30%" height="40" align="left" valign="middle" style="padding-left:3%">颜色</td>
            			<td height="40" align="left" valign="middle">浅蓝色、白色</td>
            		</tr>
                    <tr>
            			<td width="30%" height="40" align="left" valign="middle" style="padding-left:3%">袖型</td>
            			<td height="40" align="left" valign="middle">常规袖</td>
            		</tr>
                    <tr>
            			<td width="30%" height="40" align="left" valign="middle" style="padding-left:3%">风格</td>
            			<td height="40" align="left" valign="middle">小清新、韩系、日系、学院</td>
            		</tr>
                    <tr>
            			<td width="30%" height="40" align="left" valign="middle" style="padding-left:3%">裙长</td>
            			<td height="40" align="left" valign="middle">短裙（76-90cm）</td>
            		</tr>
            		</tbody>
                </table>
				<!--没有参数的情况-->
                <div class="no_canshu" style="display:none;"></div>
            </li>
            <li>
            	<div class="qingdan_div">
                	<dl>
                		<dd>
                        	<p>包装清单：</p>
                        	<p>暂无</p>
                        </dd>
                		<dd>
                        	<p>售后服务：</p>
                        	<p>本产品全国联保，享受三包服务。</p>
                        </dd>
                	</dl>
                </div>
            </li>
    	</ol>
    </div>
<!--购物车栏-->
<div class="empty45"></div>
    <div class="buy_box">
    	<div class="buy_left">
        	<div class="share_div">
                <a href="#">
                    <i></i>
                    <span>分享</span>
                </a>
            </div>
        	<div class="collect_div">
                <a href="#">
                    <i></i>
                    <span>收藏</span>
                </a>
            </div>
        	<div class="buyCar_div">
                <a href="#">
                    <i><b class="buyNum indexbgcolor">9</b></i>
                    <span>购物车</span>
                </a>
            </div>
        </div>
    	<div class="buy_center"><a href="" class="fontcolor indexbordercolor">加入购物车</a></div>
    	<div class="buy_right"><a href="" class="indexbgcolor">立即购买</a></div>
    </div>
    
    
<!--回到顶部-->
<div class="backtopbg top"></div>
<!-- 分享 -->
<div class="blackbg"></div>
<section class="sharesec">
	<ul class="shareul">
        <li><a href="#"><img src="images/shareico1.png" width="55" /><span>微信好友</span></a></li>
        <li><a href="#"><img src="images/shareico2.png" width="55" /><span>微信朋友圈</span></a></li>
        <li><a href="#"><img src="images/shareico3.png" width="55" /><span>新浪微博</span></a></li>
        <li><a href="#"><img src="images/shareico4.png" width="55" /><span>QQ好友</span></a></li>
        <li><a href="#"><img src="images/shareico5.png" width="55" /><span>QQ空间</span></a></li>
        <li><a href="#"><img src="images/shareico6.png" width="55" /><span>更多</span></a></li>
    </ul>
    <a class="shareno">取消</a>
</section>
<!--已选右弹框-->
<div class="sel_amount">
	<div class="sel_amountTop">
    	<img src="images/xqclose.png" width="19" height="19" class="xqclose" id="xqclose" />
    	<div class="detailSel_img"><img src="images/detail_img11.jpg" width="85" /></div>
    	<div class="detailSel_text">
        	<h4>大V领休闲T恤连衣裙</h4>
        	<h5>￥898.00</h5>
            <p>请选择“尺码”</p>
        </div>
    </div>
    <div class="sel_amountMiddle">
    	<ul class="sel_amountM_ul">
    		<li>
            	<div class="div_left">款式</div>
            	<div class="div_right">
                	<a class="indexbordercolor fontcolor">黄色</a>
                	<a>白色</a>
                	<a>绿色</a>
                </div>
            </li>
    		<li>
            	<div class="div_left">尺码</div>
            	<div class="div_right">
                	<a class="indexbordercolor fontcolor">S</a>
                	<a>M</a>
                </div>
            </li>
    		<li>
            	<div class="div_left">数量</div>
            	<div class="div_right paddingT3">
                    <form action="">
                    	<input type="button" value="－" class="reduce_input" />
                    	<input type="text" value="1" class="num_input" />
                    	<input type="button" value="＋" class="add_input" />
                    </form>
                </div>
            </li>
    	</ul>
    </div>
    <div class="sel_amountBottom">
    	<a href="" class="indexbgcolor">确定</a>
    </div>
</div>

</body>
<script type="text/javascript">
$(function(){
	//回到顶部
	$(window).scroll(function(e) {
		var dis1=$(window).scrollTop();
		var dis2=$(window).height();
		if(dis1>dis2){
    		$('.top').fadeIn(500);
		}else{
    		$('.top').fadeOut(500);
		}
		if(dis1<=130){
			$(".indexHeader_x").css("background","rgba(201,20,35,"+(dis1/150)+")")
		}
    });
	$('.top').click(function(e) {
        $('html,body').animate({scrollTop:0},300);
    });
	//详细介绍切换
	$(".nav_int ul li").click(function(){
		var num=$(this).index()
		$(this).addClass("indexbordercolor fontcolor").siblings().removeClass("indexbordercolor fontcolor")
		$(".content_int ol li").eq(num).show().siblings().hide()
	})
	//点击收藏
	$(".collect_div").click(function(){
		var colle=$(this).children("a").children("i")
		if(colle.hasClass("collectYes")){
			colle.removeClass("collectYes")
		}else{
			colle.addClass("collectYes")
		}
	})
	//分享
	$(".share_div").eq(0).click(function(){
		$(".blackbg").fadeIn(100);
		$(".sharesec").slideDown();
	});
	$(".shareno,.blackbg").click(function(){
		$(".blackbg").fadeOut();
		$(".sharesec").slideUp();
	});
	//头部更多点击展开
	$(".dot_more").click(function(){
		if($(".more_selDiv").is(":hidden")){
			$(".more_selDiv").show()
		}else{
			$(".more_selDiv").hide()
		}
	})
	//商品数量加减
	var i=1;
	$(".add_input").click(function(){
		i=$(".num_input").val()
		i++;
		$(".num_input").val(i)
	})
	$(".reduce_input").click(function(){
		if(i<=1){
			$(".num_input").stop()
		}else{
			i--;
			$(".num_input").val(i)
		}
	})
	//选择规格参数弹窗
	var h=$(window).height()
	$(".yixuan").click(function(){
		$(".blackbg").fadeIn(200);
		$(".sel_amount").animate({bottom:"0"},200);
	});
	$(".blackbg,#xqclose").click(function(){
		$(".blackbg").fadeOut(200);
		$(".sel_amount").animate({bottom:"-100%"},200);
	});
	$(".div_right>a").click(function(){
		$(this).addClass("indexbordercolor fontcolor").siblings("a").removeClass("indexbordercolor fontcolor");
	});
})
</script>
</html>